<template>
  <input
    type="text"
    v-model="search"
    placeholder="输入任务名称,按下回车确认"
    @keydown.enter="DoneSearch"
  />
</template>

<script>
export default {
  name: "todo-header",
  data() {
    return {
      search: "",
    };
  },
  methods: {
    //添加todo
    DoneSearch(event) {
      //调用父组件传来的方法
      this.addTodo(this.search);
      event.target.value = "";
      this.search = "";
    },
  },
  props: ["addTodo"],
};
</script>

<style scoped>
input {
  width: 250px;
  height: 30px;
}
</style>